/* 设置全局字体 */
html {
    background-color:#1e1e1e;
    font-size: 10px; /*px表示“像素（pixel）”: 基础字号为10像素*/
}
iframe {
    background-color: #ffffff;
}


/* 设置整体页面颜色 */
body {
    /*强制页面永远保持600像素宽*/
    width: 900px;
    
    /*第一个值影响元素的上下方向（在这个例子中设置为 0）
    第二个值影响左右方向
    (这里，auto 是一个特殊的值，它将可用的水平空间平均分配给左和右）*/
    margin: 0 auto;
    
    /*指定元素的背景颜色*/
    background-color: #333333;
    
    padding: 0 20px 20px 20px;
    border: 1px solid #ffffff;
    color: #ffffff;
    font-family:'Courier New', Courier, monospace;
}

/* 设置好网页的大标题 */
h1 {
    margin: 0;
    padding: 20px 0;
    color: #ffffff;

    /*对元素的文本内容施加阴影。它的四个值是：
    第一个像素值设置阴影与文本的水平偏移量：它横移的距离。
    第二个像素值设置阴影与文本的垂直偏移量：它向下移动的距离。
    第三个像素值设置阴影的模糊半径。一个更大的值会产生一个更模糊的阴影。
    第四个值设置阴影的基色。*/
    text-shadow: 3px 3px 1px black;
    font-size: 70px;
    text-align: center;
}

/* 设置网页引导图片的格式 */
img {
    display: block;
    margin: 0 auto;

    /*设置一个元素的最大宽度。
    如果元素的实际宽度超过了这个最大宽度值，
    那么元素的宽度将被限制在这个最大宽度范围内。*/
    max-width: 100%;
    
    /*设置一个元素的高度*/
    height: auto;
}

/* 设置引导目录的格式：有序列表基本格式和居中靠右 */
p,
li {
   font-size: 16px;/*字体大小*/
   line-height: 2;/*行高*/
   letter-spacing: 1px;/*字距*/
}
.centered-block {
    display: flex;
    justify-content: center;
}  
.centered-block .content {
    text-align: left;
}

/* 链接去掉下划线并且鼠标悬浮的时候显示红色 */
a {
    text-decoration: none;
    color: gray;
}
a:hover {
    color: red;
}

/* 让页尾的子元素“站长联系邮箱”和“网站备案号”居中 */
footer p
{
    color:gray;
    text-align: center;
}

/* 添加页面的分割线 */
hr {
    border: none; /* 清除默认边框样式 */
    border-bottom: 1px solid gray; /* 底部边框样式 */
}
